<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>马思特奥赛培训学校网络管理系统</title>
    <meta content='width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0, shrink-to-fit=no'
          name='viewport'/>

    <link rel="stylesheet" type="text/css" th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.min.css}"/>
    <link rel="stylesheet" type="text/css" th:href="@{/asserts/css/ready.min.css}">
    <style>
        table td {
            text-align: center;
        }

        table th {
            text-align: center;
        }

        table tr {
            height: 60px;
        }
    </style>

</head>
<body>
<div class="wrapper">
    <!--    引入公共页面 public-index。html 的模块-->
    <div th:replace="teacher/public-teacher-index :: header"></div>
    <div th:replace="teacher/public-teacher-index :: left"></div>

    <div class="main-panel">
        <div class="content">
            <div class="row">
                <!--<div class="col-md-1"></div>-->
                <div class="col-md-12">
                    <div class="card" style="width:100%;height:100%;">
                        <div class="card-body">
                            <div class="table-responsive" style=" : 20px">
                                <table class="table table-bordered table-hover" id="condition_work_table">
                                    <thead style="background-color: #f9f9f9">
                                    <tr>
                                        <th width="50">序号</th>
                                        <th>类型</th>
                                        <th>时间</th>
                                        <th>内容</th>
                                        <th>地址</th>
                                        <th>申请人</th>
                                        <th>申请时间</th>
                                        <th>当前状态</th>
                                        <th>通过/驳回</th>
                                    </tr>
                                    </thead>
                                    <tbody>

                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-1"></div>
                <div class="col-md-6" id="page_info_area"></div>
                <!-- 分页条信息 -->
                <div class="col-md-5" id="page_nav_area"></div>
            </div>
        </div>
    </div>
</div>


</body>
<script type="text/javascript" th:src="@{/webjars/jquery/1.9.1/jquery.js}"></script>
<script type="text/javascript" th:src="@{/webjars/bootstrap/3.3.7/js/bootstrap.min.js}"></script>
<script type="text/javascript" th:src="@{/asserts/js/ready.min.js}"></script>
<script type="text/javascript">
    //1、使用 window.locaion.href 获得项目的根路径
    var curWwwPath = window.location.href;
    //2、获得主机地址之后 的目录
    var pathname = window.document.location.pathname;
    var pos = curWwwPath.indexOf(pathname);
    //3、获得主机地址
    var localhostPath = curWwwPath.substring(0, pos);

    $(function () {
        to_page(1)
    })

    function to_page(pn) {
        $.ajax({
            url: localhostPath + "/edumanagement/static/examine",
            type: "get",
            data: {pn: pn},
            success: function (result) {
                console.log(result);
                build_table(result)

                build_page_info(result);

                build_page_nav(result)
            }
        })
    }

    function build_table(result) {
        $("#condition_work_table tbody").empty();
        var work = result.extend.workInfo.list;
        $.each(work, function (index, item) {
            var id = $("<td></td>").append(item.id);
            var type = $("<td></td>").append(item.typeName);
            var time = $("<td></td>").append(timestampToTime(item.beginDate) + " - " + timestampToTime(item.endDate));
            var content = $("<td></td>").append(item.workcontent);
            var location = $("<td></td>").append(item.location);
            var username = $("<td></td>").append(item.userName);
            var submitTime = $("<td></td>").append(timestampToTime(item.sumbitdate));
            if (item.appovalflag == 0) {
                var state = $("<td></td>").append("待审核");
            } else if (item.appovalflag == 1) {
                var state = $("<td></td>").append("审核通过");
            } else {
                var state = $("<td></td>").append("审核未通过");
            }
            if (item.appovalflag == 0) {
                var successBtn = $("<button></button>").addClass("btn btn-default btn-sm success_btn")
                    .append($("<span></span>").addClass("glyphicon glyphicon-trash")).append("通过");
                successBtn.attr("success-id", item.id);
                var failBtn = $("<button></button>").addClass("btn btn-default btn-sm fail_btn")
                    .append($("<span></span>").addClass("glyphicon glyphicon-trash")).append("驳回");
                failBtn.attr("fail-id", item.id);
                var btnTd = $("<td></td>").append(successBtn).append(" ").append(failBtn);
            } else if (item.appovalflag == 1) {
                var btnTd = $("<td></td>").append("审核通过");
            } else {
                var btnTd = $("<td></td>").append("审核未通过");
            }

            $("<tr></tr>")
                .append(id)
                .append(type)
                .append(time)
                .append(content)
                .append(location)
                .append(username)
                .append(submitTime)
                .append(state)
                .append(btnTd)
                .appendTo("#condition_work_table tbody");
        });
    }

    function build_page_info(result) {
        $("#page_info_area").empty();
        $("#page_info_area").append("当前" + result.extend.workInfo.pageNum + "页,总" +
            result.extend.workInfo.pages + "页,总" + result.extend.workInfo.total + "条记录")
        totalRecord = result.extend.workInfo.total;
        currentPage = result.extend.workInfo.pageNum;
    }

    function build_page_nav(result) {
        //page_nav_area
        $("#page_nav_area").empty();
        var ul = $("<ul></ul>").addClass("pagination");

        //构建元素
        var firstPageLi = $("<li></li>").append($("<a></a>").append("首页").attr("href", "#"));
        var prePageLi = $("<li></li>").append($("<a></a>").append("&laquo;"));
        if (result.extend.workInfo.hasPreviousPage == false) {
            firstPageLi.addClass("disabled");
            prePageLi.addClass("disabled");
        } else {
            //为元素添加点击翻页的事件
            firstPageLi.click(function () {
                to_page(0);
            });
            prePageLi.click(function () {
                to_page(result.extend.workInfo.pageNum - 1);
            });
        }

        var nextPageLi = $("<li></li>").append($("<a></a>").append("&raquo;"));
        var lastPageLi = $("<li></li>").append($("<a></a>").append("末页").attr("href", "#"));
        if (result.extend.workInfo.hasNextPage == false) {
            nextPageLi.addClass("disabled");
            lastPageLi.addClass("disabled");
        } else {
            nextPageLi.click(function () {
                to_page(result.extend.workInfo.pageNum + 1);
            });
            lastPageLi.click(function () {
                to_page(result.extend.workInfo.pages);
            });
        }

        //添加首页和前一页 的提示
        ul.append(firstPageLi).append(prePageLi);
        //1,2，3遍历给ul中添加页码提示
        $.each(result.extend.workInfo.navigatepageNums, function (index, item) {

            var numLi = $("<li></li>").append($("<a></a>").append(item));
            if (result.extend.workInfo.pageNum == item) {
                numLi.addClass("active");
            }
            numLi.click(function () {
                to_page(item);
            });
            ul.append(numLi);
        });
        //添加下一页和末页 的提示
        ul.append(nextPageLi).append(lastPageLi);

        //把ul加入到nav
        var navEle = $("<nav></nav>").append(ul);
        navEle.appendTo("#page_nav_area");
    }

    //更改时间格式
    function timestampToTime(timestamp) {
        var date = new Date(timestamp);
// 时间戳为10位需 * 1000，时间戳为13位的话不需乘1000
        Y = date.getFullYear() + '/';
        M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '/';
        D = (date.getDate() < 10 ? '0' + (date.getDate()) : (date.getDate()));
        return Y + M + D;
    }

    $(document).on("click", ".success_btn", function () {
        var workId = $(this).attr("success-id")
        $.ajax({
            url: localhostPath + "/edumanagement/static/SH_work",
            type: "post",
            data: {
                zt: 1, workID: workId
            },
            async: false,
            contentType: 'application/x-www-form-urlencoded',
            dataType: 'json',
            success: function () {
                alert("处理成功")
                window.location.href = "texaminePage"
            },
            error: function () {
                alert("处理失败")
            }
        })
    })

    $(document).on("click", ".fail_btn", function () {
        var workId = $(this).attr("fail-id")
        $.ajax({
            url: localhostPath + "/edumanagement/static/SH_work",
            type: "post",
            data: {
                zt: 2, workID: workId
            },
            async: false,
            contentType: 'application/x-www-form-urlencoded',
            dataType: 'json',
            success: function () {
                alert("处理成功")
                window.location.href = "texaminePage"
            },
            error: function () {
                alert("处理失败")
            }
        })
    })
</script>
</html>